<template>
  <view class="container">
    <swiper class="swiper" :style="{width:banner_w,height:banner_h}" :indicator-dots="true" :autoplay="false" :interval="5000" :duration="2000">
      <swiper-item v-for="(value,key) in banner" :id="value.adv_id" :key="key">
        <block v-if="value.position==0">
          <block v-if="value.type==0">
            <image mode="widthFix" :style="{width:banner_w,height:banner_h}" :id="value.adv_id" :src="url+value.img" v-on:click="preview(key)"></image>
          </block>
          <block v-if="value.type==3">
            <image :style="{width:banner_w,height:banner_h}" :src="url+value.img"></image>
          </block>
          <block v-else>
            <image :style="{width:banner_w,height:banner_h}" :id="value.adv_id" :src="url+value.img" v-on:click="link(value.type,value.id)"></image>
          </block>
        </block>
      </swiper-item>
    </swiper>
    <view>
      <uni-notice-bar background-color="#fff" color="#666666" showIcon scrollable text="积分商品均要自提"></uni-notice-bar>
    </view>

    <view class="goods_list" v-if="recommend.length>0">
      <view class="goods_unit" v-for="(item,index) in recommend" :key="index" :id="item.goods_id" v-on:click="goods_detail">
        <image class="goods_unit_pic" :style="{height:pic_h}" mode="aspectFill" :src="url+item.imgurl"></image>
        <view class="goods_name">{{item.goods_name.substr(0,9)}}…</view>
        <!-- <view class="sub_goods_name">{{item.title.substr(0,11)}}…</view> -->
        <view class="goods_property">
          <view class="goods_price">{{item.integral_price}}积分➕¥{{item.price}}</view>
        </view>
        <!--				<view class="goods_property">-->
        <!--					<view class="old_price">￥0</view>-->
        <!--				</view>-->
      </view>
    </view>
  </view>
</template>
<style>
.hot_more image{width:30upx;margin-left:10upx;}
.constitution_unit image{width:43%;}
.select_vedio_unit image{width:100upx;height:100upx;}
.goods_list{width:94%;margin:10upx 3%;display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;}
.goods_unit{width:49%;background: #FFFFFF;/* box-shadow: 0px 0px 6px #ccc; */margin:10upx 0;display: flex;border-radius: 10upx;overflow: hidden;
  flex-direction: column;justify-content: space-between;align-items: flex-start;padding-bottom: 10upx;}
.goods_unit_pic{width:100%;overflow:hidden;}
.goods_name{width:96%;padding:0 2%;line-height: 40upx;font-size: 28upx;color: #282828;}
.sub_goods_name{width:96%;padding:0 2%;line-height: 35upx;font-size: 26upx;color:#AAAAAA;}
.goods_property{width:96%;padding:0 2%;display: flex;justify-content: space-between;align-items: center;height: 40upx;}
.goods_price{font-size: 36upx;color: #f40601;}
.old_price,.goods_cash{font-size: 24upx;color: #AAAAAA;}
.old_price{text-decoration: line-through;}
.goods_property image{width:50upx;height: 50upx;}
.goods_commsion{margin-left:2%;width:55%;display: flex;justify-content: space-between;align-items: center;height: 40upx;border-radius:10upx;overflow: hidden;}
.commission_name{width:50%;line-height: 40upx;height:40upx;font-size:28upx;background:#ef3d19;color: #ffffff;text-align: center;}
.commission_price{width:50%;line-height: 40upx;height:40upx;font-size:26upx;background:#ffece8;color: #ef3d19;text-align: center;}
.brand_unit image{width:120upx;height: 120upx;background: #FFFFFF;border-radius: 60upx;}
.sort_unit image{width:90upx;height: 90upx;background: #FFFFFF;border-radius: 45upx;}
.swiper{margin: 20upx 0 10upx 0;width:100%;}
.search_button image{width:30upx;margin-right:10upx;}
page,.container{background: #f4f4f4;}
.foot_unit image{width:40upx;height: 40upx;}
.add image{width:80upx;height: 80upx;}
</style>
<script>
//#ifdef H5
import wxjs   from '../../jweixin/lib/index.js';
//#endif
export default {
  data() {
    return {
      name:'',
      pic_h:'',
      hot_pic_h:'',
      current: 0,
      goods_sort:[],
      start:4,
      // banner:[{'adv_id':1,'type':3,'img':'/static/images/yztang/banner1.jpg'}],
      banner:[],
      banner1:[],
      tongdao_w:'40px',
      tongdao_h:'40px',
      shangcheng_w:'40px',
      shangcheng_h:'40px',
      banner_w:'',
      banner_h:'',
      result:[],
      specs_area:[],
      sale:[],
      recommend:[],
      brand:[],
      height:'',
      share_pic:'',
      share_title:'',
      url: getApp().globalData.url,
      static:getApp().globalData.static,
      tab_current:'mall'
    }
  },
  onLoad(e) {
    var res = uni.getSystemInfoSync();
    var w = res.windowWidth;
    this.tongdao_w = w+'px';
    this.tongdao_h = w/3.75+'px';
    this.shangcheng_w = w+'px';
    this.shangcheng_h = w/3.75+'px';
    this.banner_w = w+"px";
    this.banner_h = w/1.5+"px";
    this.pic_h = w*0.94*0.49+"px";
    this.hot_pic_h = w*0.96*0.96*0.315+"px";
    this.height = res.windowHeight+"px";
    const scene = decodeURIComponent(e.scene);
    var upid    = uni.getStorageSync("upid");
    if(scene=="undefined"||scene==undefined)
    {
      if(upid=="" || upid==undefined || upid=="undefined")
      {
        if(e.upid==undefined)
        {
          uni.setStorageSync("upid",0);
        }
        else
        {
          uni.setStorageSync("upid",parseInt(e.upid));
        }
      }
    }
    else
    {
      uni.setStorageSync("upid",scene);
    }
    // this.initialize();
  },
  onShow(){
    this.start = 4;
    this.initialize();
    //#ifdef H5
    var ua = navigator.userAgent.toLocaleLowerCase();
    if(ua.match(/MicroMessenger/i) == 'micromessenger')
    {
      this.share_config();
    }
    //#endif
  },
  //#ifdef MP-WEIXIN
  onShareAppMessage(res) {
    var member_id = uni.getStorageSync("member_id");
    if(member_id=="")
    {
      var upid = 0;
    }
    else
    {
      var upid = member_id;
    }
    var title    = this.share_title;
    // var imgurl   = this.url + this.banner[0].img;
    var imgurl   = this.share_pic;
    return {
      title: title,
      path: '/pages/mall/index?upid='+member_id,
      imageUrl:imgurl
    }
  },
  onShareTimeline(res)
  {
    var member_id = uni.getStorageSync("member_id");
    if(member_id=="")
    {
      var upid = 0;
    }
    else
    {
      var upid = member_id;
    }
    // var title       = '谷牧之道商城-';
    // var imgurl      = this.url + this.banner[0].img;
    var title    = this.share_title;
    // var imgurl   = this.url + this.banner[0].img;
    var imgurl   = this.share_pic;
    return {
      title: title,
      query: 'upid='+upid,
      imageUrl:imgurl
    }
  },
  //#endif
  onReachBottom:function()
  {
    this.get_goods_list();
  },
  methods: {
    share_config:function()
    {
      var that = this;
      console.log(window.location.href);
      uni.request({
        url: this.url+"/wechat_share",
        data: {url:window.location.href},
        header: {'Content-Type': 'application/json'},
        success: function (res)
        {
          console.log(res.data);
          wxjs.config({
            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
            appId: res.data.appId,         // 必填，公众号的唯一标识
            timestamp: res.data.timestamp, // 必填，生成签名的时间戳
            nonceStr: res.data.nonceStr,   // 必填，生成签名的随机串
            signature: res.data.signature,        // 必填，签名
            jsApiList: ['updateAppMessageShareData','updateTimelineShareData']            // 必填，需要使用的JS接口列表
          });
          wxjs.ready(function () {
            var shareData1 = {
              title:'谷牧之道', // 分享标题
              desc: '全国健康类产品，一站式购物平台，厂家产品会员价', // 分享描述
              link: that.url+'/wap',  // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
              imgUrl: that.url+'/web/static/img/a.png', // 分享图标
              // type: '', // 分享类型,music、video或link，不填默认为link
              // dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
              success: function () {
                // alert('成功');
                console.log("设置成功");
              }
            };
            var shareData2 = {
              title:'谷牧之道-全国健康类产品，一站式购物平台，厂家产品会员价', // 分享标题
              link: that.url+'/wap',  // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
              imgUrl: that.url+'/web/static/img/a.png', // 分享图标
              success: function () {
                // alert('成功');
                console.log("设置成功");
              }
            };
            // wxjs.onMenuShareAppMessage(shareData1);
            wxjs.updateAppMessageShareData(shareData1);
            wxjs.updateTimelineShareData(shareData2);
          })

        }
      })
    },
    link:function(type,id)
    {
      if(type=="1")
      {
        uni.navigateTo({
          url:"../mall/union?id="+id
        })
      }
      if(type=="2")
      {
        uni.navigateTo({
          url:"../mall/goods_detail?id="+id
        })
      }
      console.log(type);
    },
    test_head:function()
    {
      uni.navigateTo({
        url:"test_head"
      })
    },
    brand_detail:function(e)
    {
      var id = e.currentTarget.id;
      uni.navigateTo({
        url:"brand_detail?id="+id
      })
    },
    goods_list:function(e)
    {
      var sort = e.currentTarget.dataset.type;
      uni.navigateTo({
        url:"goods_list?sort="+sort
      })
    },
    tongdao:function(e)
    {
      uni.navigateTo({
        url:"quanyizhongxin"
      })
    },
    jifenshangcheng:function(e)
    {
      uni.navigateTo({
        url:"/pages/merchant/index"
      })
    },
    constitution:function(e)
    {
      var id = e.currentTarget.id;
      uni.navigateTo({
        url:"constitution_detail?id="+id
      })
    },
    cart:function()
    {
      var member_id = uni.getStorageSync("member_id");
      if(member_id=="")
      {
        uni.navigateTo({
          url:"/pages/member/login"
        })
      }
      else
      {
        uni.navigateTo({url:"/pages/mall/cart"});
      }
    },
    goods_detail:function(e)
    {
      var id = e.currentTarget.id;
      uni.navigateTo({
        url:"../mall/integral_goods_detail?id="+id
        // url:"../mall/goods_detail?id=93"
      })
    },
    sort_list:function(e)
    {
      var id = e.currentTarget.id;
      console.log("sort_list:::::"+id);
      uni.setStorageSync("sort_id",parseInt(id));
      uni.switchTab({
        url:"../mall/sort_index?id="+id
      })
    },
    get_goods_list:function()
    {
      var that = this;
      //#ifdef MP-WEIXIN
      var type = "weixin";
      //#endif
      //#ifdef APP-PLUS
      var type = "app";
      //#endif
      //#ifdef H5
      var type = "app";
      //#endif
      var member_id = uni.getStorageSync("member_id");
      uni.request({
        url: this.url+'/wechat_goods_list',
        data: {member_id:member_id,id:0,type:type,start:this.start,integral:1},
        header: {'Content-Type': 'application/json'},
        success: (res) => {
          console.log(res.data);
          if(res.data.status==1)
          {
            that.start += 4;
            for(var i=0;i<res.data.result.length;i++)
            {
              that.recommend.push(res.data.result[i]);
            }
          }
          else
          {
            uni.showToast({
              title:"我是有底线的",
              duration:1000
            })
          }
        }
      });
    },
    input_:function(e)
    {
      if(e.currentTarget.dataset.name=="name")
      {
        this.name = e.target.value;
      }
    },
    search:function()
    {
      if(this.name=="")
      {
        uni.showToast({
          title:"不能为空",
          duration:2000
        })
      }
      else
      {
        uni.navigateTo({
          url:"/pages/mall/search?name="+this.name
        })
      }
    },
    initialize:function()
    {
      var that = this;
      var member_id = uni.getStorageSync("member_id");
      //#ifdef MP-WEIXIN
      var type = "weixin";
      //#endif
      //#ifdef APP-PLUS
      var type = "app";
      //#endif
      //#ifdef H5
      var type = "app";
      //#endif
      uni.request({
        url: this.url+"/wechat_index",
        data: {member_id:member_id,type:type,integral:1},
        header: {'Content-Type': 'application/json'},
        success: function (res)
        {
          that.banner = res.data.banner;
          that.banner1 = res.data.banner1;
          that.goods_sort = res.data.sort;
          that.specs_area = res.data.specs_area;
          that.sale       = res.data.sale;
          that.recommend  = res.data.recommend;
          that.brand      = res.data.big_brand_good_goods;
          that.share_pic  = res.data.share_pic;
          that.share_title = res.data.share_title;
        }
      })
    }
  }
}

</script>


